<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<!-- 引入head中公共部分 -->
<head th:replace="header::header-commo(商品详情)"></head>

<body>
<!-- 引入头部导航-->
<header th:replace="header::header-nav"></header>
        <!--主区域-->
<div class="container" style="margin-top: 10px;">
	<div class="row">
				<div class="col-md-12 col-xs-12">
					<div class="row" style="margin-bottom: 10px;">
						<div class="col-md-5 col-xs-5">
							<div>
								<a href="#"><img class="img-responsive" th:src="@{'/upload/'+${item.image}}" src="img/goods1.jpg" /></a>
							</div>
						</div>
						<div class="col-md-7 col-xs-7 product-info">
							<div>
								<h3 class="pord-name" th:text="${item.name}">布隆雕塑</h3>
							</div>
							<div class="pord-price clearfix">
								<span class="pord-dispri">￥<strong th:text="${item.shopPrice}">98.00</strong></span>
								<span class="pord-orpri" th:text="${'￥' + item.marketPrice}">￥98.00</span>
							</div>
							<!--<div class="pord-detailbox clearfix">
								<div class="pull-left pord-sold">已售：<span>1448</span></div>
								<div class="pull-left pord-totalcom">累计评价：<span class="commentNum">48</span></div>
							</div>-->
							<div id="blk_detail_main_btn">
								<form th:action="@{/cart/add}"  action="" method="post">
									<input type="hidden" name="id" th:value="${item.id}">
									<div class="mt10 pord-num clearfix">
									<label class="pull-left pt10">数量</label>
									<div class="pull-left ml42">
										<a href="javascript:;" id="js-buy-min" class="pull-left num-plus numbtn num-plus btn_detail_main_buy_min">
											<i class="ico-detail">-</i></a>
										<input name="count" id="js-buy-num" type="text" size="2" maxlength="3" class="fl nummidbtn num inpt_detail_main_buy_num" value="1">
										<a href="javascript:;" id="js-buy-plus" class="pull-left numbtn num-minus btn_detail_main_buy_plus"><i class="ico-detail">+</i></a>
									</div>
									<span class="pord-stock" th:text="${'（库存：'+ item.num + '）'}">（库存：888）</span>
								</div>
								<div class="pord-btn clearfix">
									<button  type="submit" id="btn_detail_cart_add" class="fl joincart-btn">加入购物车</button>
									<button  type="submit" id="btn_detail_cart_buy"  class="fl ml30 buy-btn">立即购买</button>
									<a href="javascript:;" class="fl btn-collect">
										<i class="ico-detail ico-collect"></i>
										<span>收藏</span>
									</a>
									<a href="javascript:;" class="fl btn-collected" style="display: none">
										<i class="ico-detail ico-collect"></i>
										<span>已收藏</span>
									</a>
								</div>
								</form>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-md-12 col-xs-12">
							<div class="bs-example bs-example-tabs" data-example-id="togglable-tabs">
								<ul id="myTabs" class="nav nav-tabs" role="tablist">
									<li role="presentation" class="active">
										<a href="#home" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">商品介绍</a>
									</li>
									<li role="presentation">
										<a href="#profile" role="tab" id="profile-tab" data-toggle="tab" aria-controls="profile">商品评论</a>
									</li>
								</ul>
								<div id="myTabContent" class="tab-content ">
									<div role="tabpanel" class="tab-pane fade in active" id="home" aria-labelledby="home-tab">
										<img class="img-responsive center-block" th:src="@{'/upload/'+${item.idesc}}" src="img/info1.jpg" />
									</div>
									<div role="tabpanel" class="tab-pane fade" id="profile" aria-labelledby="profile-tab">
										<div class="media">
											<div class="media-left">
												<a href="#">
													<img class="media-object" th:src="@{/img/g.jpg}" src="img/g.jpg" alt="...">
												</a>
											</div>
											<div class="media-body">
												<h4 class="media-heading">商品评分</h4> 非常不错啊！！！
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
</div>
	<!--底部-->
<!--底部-->
<footer th:replace="footer::footer-commo"></footer>
</body>
<script th:inline="javascript">
	//页面初始化
	$(function () {
		//获取商品库存
		var num = [[${item.num}]];
		//获取显示数量的控件
		var $buyNum = $("#js-buy-num");
		//给-按钮绑定事件
		$("#js-buy-min").click(function () {
			//点击减号按钮的时候
			var buyNum = Number($buyNum.val());
			//值减一
			buyNum = buyNum-1;
			if (buyNum < 0){
				buyNum = 0 ;
			}
			$buyNum.val(buyNum);
		});
		$("#js-buy-plus").click(function () {
			//点击加号按钮的时候
			var buyNum = Number($buyNum.val());
			//值加一
			buyNum = buyNum+1;
			if (buyNum > num){
				buyNum = num
			}
			$buyNum.val(buyNum);
		});
	})
</script>
</html>